<template>
  <form @submit="formSubmit">
    <div class='depotEnterDetail'>
      <scroll-view scroll-y>
        <detailList :data="data"></detailList>
        <div class="detailList">
          <div class="weui-cells__title header">入库信息</div>
          <div class="weui-cells weui-cells_after-title">
            <div class="weui-cell">
              <div class="weui-cell__bd must">入库仓库</div>
              <div class="weui-cell__ft">
                <picker class="weui-cell__bd" range-key="warehouseName" name="indexPicker" :disabled="editCode" @change="PickerChange" :value="data.indexPicker"
                  :range="cangkuList">
                  <view class="weui-select weui-select_in-select-after noneBorder">
                      {{ data.cangku }}
                    </view>
                </picker>
              </div>
            </div>

            <div class="weui-cell">
              <div class="weui-cell__bd">备注</div>
              <div class="weui-cell__ft">
                <input maxlength="400" :disabled="editCode" name="inRemark" :value="data.inRemark" placeholder="最多输入400字" />
              </div>
            </div>


            <div class="weui-cell">
              <div class="weui-cell__bd must">车龄照片</div>
              <div class="weui-cell__ft">
                <Qinniu  :disabled="editCode" :data="inPicList"></Qinniu>
              </div>
            </div>
          </div>
        </div>
        <view class="btn-area submit">
          <button formType="submit">提交</button>
        </view>
      </scroll-view>
    </div>
  </form>
</template>

<script>
  import detailList from '@/components/common/detailList'
  import Qinniu from '@/components/common/Qinniu'

  export default {
    data() {
      return {
        data: {
            inRemark:"",  //备注
            stockWarehouseId:"",    //仓库id
            warehouseName:"",     //仓库地址的名字
        }, //数据源
        inPicList: [], //照片
        cangkuList: [], //仓库地址
        editCode: true, //编辑，还会查看，亦或者是添加
      }
    },
    methods: {
      PickerChange(e) {
        this.data.indexPicker = e.mp.detail.value;
        let obj = this.cangkuList[this.data.indexPicker]
        this.data.cangku = obj.warehouseName;
        this.data.stockWarehouseId = obj.id
        this.data.warehouseName = obj.warehouseName
      },
      formSubmit: function (e) {
        const params =e.mp.detail.value; 
       // 传入表单数据，调用验证方法
        if (!this.WxValidate.checkForm(params)) {
            const error = this.WxValidate.errorList[0]
            this.WxValidate.showModal(error)
          return false
        }

        if(this.inPicList.length==0){
            this.WxValidate.showModal({msg: '请上传车龄照片'})
            return false;
        }
        params.id = this.data.id ;
        params.stockWarehouseId = this.data.stockWarehouseId ;
        params.stockWarehouseId = this.data.stockWarehouseId ;
        params.inPicList = this.inPicList ;

        

        this.$https.postJson("token/authentication/warehouse/request_in_stock",params).then(res=>{
                this.WxValidate.showModal({
                  msg: res.data.data||'提交成功',
                })
        })
    
      },
      // 判断disabled状态
      is_disabled() {
        let code = this.$mp.query.idCode
        switch (true) {
          case code == 1: //编辑
            this.editCode = false;
            break;
          case code == 2: //查看
            this.editCode = true;
            break;
          default:
            this.editCode = false;
            break; //添加
        }
      },
      //验证规则
       initValidate() {
        // 验证字段的规则
        const rules = {
          indexPicker:{
            required: true
          }
        }

        const message = {
              indexPicker:{
            required: "请选择仓库"
          }
        }

        //创建实例对象
        this.WxValidate = new this.wxValidate(rules,message);


      },
    },
    components: {
      detailList,
      Qinniu
    },
    mounted() {
      // console.dir("传递过来的id为"+this.$mp.query.id)
      this.initValidate();
      this.is_disabled();
      let queryData = JSON.parse(this.$mp.query.item) ;
      this.data = Object.assign({},queryData,this.data);
      this.$https.get("token/common/get_warehouse_list").then(res => {
        this.cangkuList = res.data.data
      })
    }
  }
</script>


<style lang="scss" scoped>
  .depotEnterDetail {
    height: 100%;
    box-sizing: border-box;

    scroll-view {
      height: 100%;

    }

  }
</style>
